<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>带进度条的焦点图轮播</title>
<link type="text/css" href="css/lrtk.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/zcommon.js"></script>               
<script type="text/javascript">
jQuery(document).ready(function(){AcerUi.init();});
</script>
</head>	
<body>
<!-- 代码开始 -->
<div id="showcase" class="cloud row-content showcase">
	<div class="container">
		<div class="slide" style="display:block; ">                
			<div class="content-main-visual">
				<a class="pc" target="_blank"><img src="/image/01.jpg"></a>	
				<a class="pc" target="_blank"><img src="/image/04.jpg"></a>
				<a class="pc" target="_blank"><img src="/image/03.jpg"></a>
				<a class="pc" target="_blank"><img src="/image/02.jpg"></a>
			</div>
			<div class="content-main-feature">
				<div class="feature green">
					<a href="#" class="current">
						<img src="/image/01.jpg">
						<span>Acer 文件</span>
						<div class="timerLine dark-green"></div><!-- 进度条 -->
					</a>
				</div>
				<div class="feature azure">
					<a href="#">
						<img src="/image/02.jpg">
						<span>Acer 远程文件</span>
						<div class="timerLine dark-azure"></div>
					</a>				
				</div>           
				<div class="feature brick">
					<a href="#">
						<img src="/image/03.jpg">
						<span>Acer 照片</span>
						<div class="timerLine dark-brick"></div>
					</a>
				</div>           
				<div class="feature gray">
					<a href="#">
						<img src="/image/04.jpg">
						<span>Acer 多媒体</span>
						<div class="timerLine dark-gray"></div>
					</a>
				</div>           
			</div>
		</div>
	</div>
</div>
<!-- 代码结束 -->
</body>
</html>